import Observer from './Observer.js'
import Compiler from './Compiler.js'
import Watcher from './Watcher.js'

export default class Vue {
  constructor(options) {

    this.$options = options

    const {
      data,
      el,
    } = this.$options

    if (typeof data === 'function') {
      this.$data = data()
    } else {
      this.$data = data
    }

    Observer.observe(this.$data)

    this.initData()

    // this.initWatch()

    if (el) {
      this.$el = document.querySelector(el)
      new Compiler(this)
    }

  }

  initData() {
    for (const key of Object.keys(this.$data)) {
      Object.defineProperty(this, key, {
        get() {
          return this.$data[key]
        },
        set(newValue) {
          this.$data[key] = newValue
        }
      })
    }
  }

  // // 这里依赖收集有问题，所有的watcher都会收集到this.$data身上的dep中，导致同时触发所有watch
  // initWatch() {
  //   const {
  //     watch
  //   } = this.$options

  //   if (watch) {
  //     for (const v of Object.keys(watch)) {
  //       new Watcher(this.$data, v, watch[v])
  //     }
  //   }
  // }

}
